Build a "Best of Tokyo" City Guide in 3 Hours

I'm creating a city guide about [your theme].

Research and find me 6-8 real places/spots with the following for each:
1. Name (Japanese + English)
2. One-line description (what makes it special)
3. Address
4. Approximate price range (¥ / ¥¥ / ¥¥¥)
5. Best time to visit
6. One insider tip or detail most tourists wouldn't know

Focus on quality over quantity. Include a mix of well-known gems
and lesser-known local favorites.

Now help me add editorial context:

1. Write a short intro paragraph (3-4 sentences) that sets the mood
   for this guide. Why does this theme/area matter? What's the vibe?
2. Suggest a walking route that connects 4-5 of these spots in a
   logical order.
3. Give me 3 "pro tips" for someone exploring this theme for the
   first time.
4. Suggest relevant tags/categories I can use for filtering
   (e.g., "budget-friendly", "rainy day", "date spot", "solo-friendly").

Compile all of this into a JSON-structured document I can use
for a web app. Format each spot like this:

{
  "name_en": "",
  "name_ja": "",
  "description": "",
  "address": "",
  "price": "",
  "best_time": "",
  "insider_tip": "",
  "tags": [],
  "lat": null,
  "lng": null
}

Also include the intro paragraph, walking route, and pro tips
as separate fields. Save everything as a file.

Build a React city guide web app using my research data below.

[paste your JSON data here]

The app should have:
1. A hero section with the guide title, intro paragraph, and a
   moody background image (use a placeholder or gradient)
2. A filter bar — users can filter spots by tags
3. A card grid — each spot displayed as a card showing:
   - Name (Japanese + English)
   - Description
   - Price range
   - Best time to visit
   - Tags as small badges
4. A detail view — clicking a card expands to show the insider tip
5. A "Pro Tips" section at the bottom

Use Tailwind CSS. Make it feel editorial and modern — think
a magazine-quality city guide, not a spreadsheet.
Single-page app, no backend needed.

Update the design:
- Use a dark theme with warm accent colors (amber/orange tones)
- Cards should have a subtle hover animation (slight lift + shadow)
- Add a gradient overlay on the hero section
- Use a clean Japanese-friendly font stack
  (system-ui for English, Noto Sans JP fallback for Japanese)
- Add smooth fade-in animations when cards appear
- Make the tag filter pills look like they belong in a
  design magazine

Add these interactive features:
1. Clicking a tag filter animates the card grid (filtered cards
   fade in, hidden ones fade out smoothly)
2. Add a "Walking Route" section that displays the suggested
   route as a numbered step-by-step with connecting lines
3. Add a "copy address" button on each card that copies the
   Japanese address to clipboard (useful for taxi/maps)
4. Add a small map placeholder section showing a static
   embedded map image or illustration

Make the app fully responsive:
- On mobile: cards stack in a single column
- The filter bar scrolls horizontally on small screens
- Hero section text is readable on all sizes
- Touch-friendly tap targets on all interactive elements

Final polish:
- Add a footer with "Made with AI Builders x Qoder" and today's date
- Add a subtle page-load animation
- Make sure the overall rhythm and spacing feels balanced
- Add emoji indicators next to price ranges (💰 💰💰 💰💰💰)

Create a visual slide deck (5 slides) presenting my Tokyo city guide project.

Guide title: [your title, e.g., "Hidden Kissaten: Tokyo's Retro Coffee Shops"]
Theme: [your theme]
Number of spots: [number]
Key highlights: [2-3 of your favorite spots from the research]

Slide structure:
Slide 1: Title slide — guide name + "Built with Vibe Coding"
Slide 2: The Concept — what this guide is about, who it's for
Slide 3: Highlights — feature 2-3 standout spots with descriptions
Slide 4: The Build Process — QoderWork for research → Qoder for coding → 3 hours total
Slide 5: Try It Yourself — QR code placeholder + AI Builders / Qoder links

Make it visually clean and modern. Save as .pptx.

Update slide 3 or 4 to include a space for my app screenshot.
Add a device mockup frame around it so it looks professional.

Write me a 60-second presentation script for demoing this project.
Cover:
1. What I built and why I chose this theme (10 sec)
2. Quick walkthrough of the guide features (30 sec)
3. How I built it — research with QoderWork, code with Qoder (15 sec)
4. Closing line (5 sec)

Keep it natural and conversational, not salesy.

Find me 6-8 real places for [theme]. Include: name (JP + EN),
description, address, price range, best time, insider tip.

Write an intro paragraph, suggest a walking route,
give 3 pro tips, and suggest filter tags.

Format everything as structured JSON and save as a file.

Build a React city guide: hero, filter bar, card grid,
detail view, pro tips section. Use Tailwind. Modern editorial feel.

Refine: dark theme, hover animations, Japanese font stack,
fade-in animations, magazine-quality design.

Add interactivity: animated filtering, walking route display,
copy-address buttons, responsive layout.

Create a 5-slide pitch deck: title, concept, highlights,
build process, try-it-yourself. Save as .pptx.

Write a 60-second demo script: theme intro, app walkthrough,
build process, closing.